@import (reference) "../../normal.less";

.red-packets {
  position: fixed;
  z-index: 8;
  @f11();
  .mask();
  .panel {
    position: absolute;
    z-index: 1;
    width: 728rpx;
    height: 649rpx;
    .center(728rpx,649rpx);
    animation: bounceIn 1s linear forwards;
    .bg {
      @fill();
    }
    .users {
      position: absolute;
      top: -42rpx;
      width: 100%;
      height: 230rpx;
      display: flex;
      align-items: flex-start;
      justify-content: center;
      flex-flow: row nowrap;
      .u,
      .t {
        position: relative;
        width: 130rpx;
        height: 230rpx;
        display: flex;
        flex-flow: column nowrap;
        justify-content: flex-start;
        align-items: center;
        .nickname {
          margin-top: 18rpx;
          margin-bottom: 10rpx;
          font-size: 36rpx;
          font-family: FZCuYuan-M03S;
          font-weight: 400;
          color: #d58e5a;
          text-align: center;
        }
        .tag {
          font-size: 18rpx;
          font-family: FZCuYuan-M03S;
          font-weight: 400;
          padding: 0.5em 1em;
          background: #d58e5a;
          color: #fff8de;
          text-align: center;
          margin: 0 auto;
          margin-top: 18rpx;
        }
      }
    }
    .content {
      width: 290rpx;
      height: auto;
      position: absolute;
      top: 200rpx;
      left: 50%;
      transform: translateX(-50%);
      text-align: center;
      font-size: 28rpx;
      font-family: Microsoft YaHei;
      font-weight: bold;
      color: rgba(213, 142, 90, 1);
    }
    .btn {
      width: 357rpx;
      height: 124rpx;
      position: absolute;
      left: calc((100% - 357rpx) * 0.5);
      bottom: 110rpx;
    }
  }
}

.btn-hover();
